import React, {Component} from 'react';
import './message.scss';
import {Subject} from 'rxjs';

class Message extends Component {
    constructor(props) {
        super(props);
        this.state = {
            info: undefined
        }
        this.saveTime = undefined;
        window.$message = new Subject();
        window.$message.subscribe(res => {
            if (this.saveTime === undefined || (new Date().getTime() - this.saveTime.getTime() > 2000)) {
                this.saveTime = new Date();
                this.saveTime = new Date();
                this.setState({
                    info: res
                });
                setTimeout(() => {
                    this.setState({
                        info: undefined
                    })
                }, 1900);
            }
        })
        // window.$message.next({info: 'error', content: '测试'});
    }
    render() {
        return this.state.info ? <div className='message-comp top-center'>
            <p className='shadow both-left-center'>
                <img alt='logo' src={require(`../../../assets/img/${!this.state.info.info || this.state.info.info === 'error' ? 'error' : 'warn'}.png`)}/>{this.state.info.content}
            </p>
        </div> : ''
    }
}

export default Message;